<!--页面组件-->
<template>
  <div processingModal1>
    <!-- <loading /> -->
    <!-- v-loading="loading" -->
    <Modal
      v-model="showCreateTaskModal"
      draggable
      scrollable
      title="任务创建"
      :width="1140"
      :styles="{ top: '60px' }"
      class="processingModal"
    >
      <p slot="header" class="modalHeader">任务创建</p>
      <CButtonClose slot="close" @click="showCreateTaskModalx" />
      <CRow>
        <CCard class="leftCard" border-color="white" style="width: 60%">
          <div class="cardBody">
            <header>
              <CRow>
                <CCol md="7">
                  <CInput
                    label="任务名称"
                    style="width: 385px"
                    horizontal
                    v-model="taskName"
                    :title="taskName"
                    maxlength="50"
                  />
                </CCol>
                <CCol md="5">
                  <!-- <CSelect
                  label="优先级"
                  style="width:210px"
                  horizontal
                  :options="options"
                  :value.sync="priorityLevel"
                  />-->
                  <div>
                    <div class="levelDiv">优先级</div>
                    <div class="inputRadioDiv1">
                      <CInputRadio
                        v-for="(item, index) in options"
                        :key="index"
                        type="radio"
                        :label="item.label"
                        :checked="item.isCheck"
                        @change="changeInputLevel(index)"
                        style="margin: 0 10px"
                      />
                    </div>
                  </div>
                </CCol>
              </CRow>
              <CRow v-show="productionTypeRow" class="filterRadioRow">
                <div class="inputRadioDiv3">
                  <span style="margin-right: 38px">产品类型</span>
                  <CInputRadio
                    v-for="(item, index) in productionType"
                    :key="index"
                    type="radio"
                    :label="item.label"
                    :checked="item.isCheck"
                    @change="changeInputProductionType(index)"
                    style="margin-left: 10px; margin-right: 10px"
                  />
                </div>
                <!-- <div v-show="isRegion" style="margin-left: 66px; margin-top: -6px; width: 31.6%;">
                  <span style="float:left;margin-top: 6px;">区域</span>
                  <Cascader
                    :data="regionCascader"
                    change-on-select
                    filterable
                    v-model="algSelect"
                    class="regionCas"
                    :load-data="loadRegionData"
                    @on-change="regionChangeEvent"
                  ></Cascader>
                </div>-->
              </CRow>
              <CRow v-show="sensorRow">
                <CSelect
                  label="卫星/传感器"
                  class="processFileterDiv"
                  horizontal
                  :options="sensorOption"
                  :value.sync="sensorOptionValue"
                  @change="changeSensorType(index)"
                  style="margin-left: 10px"
                />
              </CRow>
              <CRow v-show="timeRow">
                <!-- <div style="margin-left:16px">合成方式</div> -->
                <!-- <div class="inputRadioDiv4">
                  <CInputRadio
                    v-for="(item,index) in mixType"
                    :key="index"
                    type="radio"
                    :label="item.label"
                    :checked="item.isCheck"
                    :value.sync="mixTypeValue"
                    @change="changeInputMixType(index)"
                    style="margin-left:10px;margin-right:10px"
                  />
                </div>-->
                <CSelect
                  label="合成方式"
                  class="processFileterDiv"
                  horizontal
                  :options="mixType"
                  :value.sync="mixTypeValue"
                  style="margin-left: 10px"
                />
              </CRow>
              <CRow v-show="algoModelRow">
                <CSelect
                  label="算法模型"
                  class="processFileterDiv"
                  horizontal
                  :options="algoTypeOption"
                  :value.sync="algoTypeOptionValue"
                  @change="changeInputAlgoType(index)"
                  style="margin-left: 10px"
                />
              </CRow>

              <CRow v-show="timeRow" class="filterRadioRow">
                <div class="inputRadioDiv3">
                  <span style="margin-right: 38px">时间尺度</span>
                  <CInputRadio
                    v-for="(item, index) in timeList"
                    :key="index"
                    type="radio"
                    :label="item.label"
                    :checked="item.isCheck"
                    @change="changeInputTimeOption(index)"
                    style="margin-left: 10px; margin-right: 10px"
                  />
                  <!-- <div
                    v-show="isRegion"
                    style="margin-left: 206px; margin-top: -6px; width: 31.6%;"
                  >
                    <span style="float:left;margin-top: 6px;">区域</span>
                    <Cascader
                      :title="regionTitle"
                      :data="regionCascader"
                      change-on-select
                      filterable
                      class="regionCas"
                      :load-data="loadRegionData"
                      @on-change="regionChangeEvent"
                    ></Cascader>
                  </div>-->
                  <!-- style="margin-left:138px" -->
                  <div>
                    <!-- <label class="filterLabel">时间</label> -->
                    <DatePickers
                      :type="timeType"
                      :placeholder="timePlaceholder"
                      :format="timeFormat"
                      class="datePick"
                      transfer
                      show-week-numbers
                      @on-change="onTimeChange"
                      :value="currentTime"
                      :editable="false"
                    ></DatePickers>
                  </div>
                </div>
                <!-- <div style="margin-left:122px;margin-top:2px" class="form-group">
                  <label>时间</label>
                  <DatePickers
                    :type="timeType"
                    :placeholder="timePlaceholder"
                    :format="timeFormat"
                    class="datePick"
                    transfer
                    show-week-numbers
                    @on-change="onTimeChange"
                    :value="currentTime"
                    :editable="false"
                  ></DatePickers>
                </div>-->
              </CRow>

              <CRow v-show="productionLineRow">
                <div class="form-row form-group" style="margin-left: 10px">
                  <CCol sm="1.5">
                    <span>流程选择</span>
                    <!-- <br />
                        <sapn @click="processFilter" class="processFilter">
                          <i class="fa fa-filter"></i> 过滤
                    </sapn>-->
                  </CCol>
                  <div class="inputRadioDiv">
                    <CInputRadio
                      v-for="(item, index) in listproductLine"
                      :key="index"
                      type="radio"
                      :label="item.workflowName"
                      :value="item.workflowName"
                      :checked="item.isCheck"
                      @change="changeInput(index)"
                      @click="search(item, index)"
                      class="inputRadio"
                    />
                  </div>
                </div>
              </CRow>

              <CRow v-show="isRegion">
                <div class="inputRadioDiv3">
                  <span style="margin-right: 38px">区域范围</span>
                  <!-- style="width:274px" -->
                  <div>
                    <CInputRadio
                      v-for="(item, index) in regionType"
                      :key="index"
                      type="radio"
                      :label="item.label"
                      :checked="item.isCheck"
                      @change="changeInputRegionOption(index)"
                      style="margin-left: 10px; margin-right: 10px"
                    />
                  </div>
                  <!-- style="margin-left:138px" -->
                  <div>
                    <!-- <label class="filterLabel">区域</label> -->
                    <Cascader
                      :title="regionTitle"
                      :data="regionCascader"
                      change-on-select
                      filterable
                      class="regionCas"
                      :load-data="loadRegionData"
                      @on-change="regionChangeEvent"
                    ></Cascader>
                  </div>
                </div>
              </CRow>
            </header>
            <main>
              <div class="position-relative table-responsive1">
                <table class="table">
                  <!-- table-hover -->
                  <!-- table-bordered -->
                  <!-- <thead>
                          <th style="vertical-align: center">
                            <div style="width:50%; text-align:center; margin:0 auto">
                              <div style=" position:absolute">参数名称</div>
                              <div style="float:right">参数值</div>
                            </div>
                          </th>
                  </thead>-->
                  <tbody>
                    <tr v-show="showGlobalParameter">
                      <td>
                        <div class="tbHeader">
                          <span style="float: left">基本参数：</span>
                          <CButton
                            class="hoverstyle imgBtn"
                            id="globalParamId"
                            :title="'显示更多参数'"
                            variant="outline"
                            color="info"
                            :flag="'hidden'"
                            @click="displayDtParamBtn('globalBtn')"
                          >
                            <img class="jia" :src="tdRightImg('plus')" alt />
                          </CButton>
                        </div>
                        <CDataTable
                          :key="globalItems"
                          :items="globalItems"
                          :fields="fields"
                          class="paramTable"
                          :header="haveHeader"
                          border
                          hover
                        >
                          <template #value="{ item }" style="width: 60%">
                            <td>
                              <CSelect
                                v-if="item.type.name.toLowerCase() === 'select'"
                                horizontal
                                :options="item.constraint"
                                :value.sync="item.default"
                                class="inputSelectTd"
                                placeholder="请选择"
                              ></CSelect>
                              <CSelect
                                v-else-if="
                                  item.type.name.toLowerCase() === 'boolean'
                                "
                                horizontal
                                :options="[
                                  { label: '请选择', value: '' },
                                  { label: '是', value: true },
                                  { label: '否', value: false },
                                ]"
                                :value.sync="item.default"
                                class="inputSelectTd"
                              ></CSelect>
                              <div
                                v-else-if="
                                  item.type.name.toLowerCase() === 'dir'
                                "
                              >
                                <template>
                                  <CInput
                                    v-model="item['default']"
                                    clearable
                                    autocomplete="off"
                                    class="inputTd"
                                    :title="item.default"
                                    :placeholder="`${item.desc}`"
                                  />
                                  <CButton
                                    color="info"
                                    size="sm"
                                    @click="browserFile(item)"
                                    class="btnBrowser"
                                    >...</CButton
                                  >
                                </template>
                              </div>
                              <div
                                v-else-if="
                                  item.type.name.toLowerCase() === 'file'
                                "
                              >
                                <template horizontal>
                                  <CInput
                                    v-model="item.default"
                                    clearable
                                    autocomplete="off"
                                    class="inputTd"
                                    :title="item.default"
                                    :placeholder="`${item.desc}`"
                                  />
                                  <CButton
                                    color="info"
                                    size="sm"
                                    @click="browserFile(item)"
                                    class="btnBrowser"
                                    >...</CButton
                                  >
                                </template>
                              </div>
                              <div
                                v-else-if="
                                  item.type.name.toLowerCase() === 'spatialref'
                                "
                              >
                                <template>
                                  <CInput
                                    v-model="item.default"
                                    clearable
                                    autocomplete="off"
                                    class="inputTd"
                                    :title="item.default"
                                    :placeholder="`${item.desc}`"
                                  />
                                  <CButton
                                    color="info"
                                    size="sm"
                                    @click="browserRef(item)"
                                    class="btnBrowser"
                                    >...</CButton
                                  >
                                </template>
                              </div>
                              <!-- <CInput v-else v-model="item.default" class="inputTd"></CInput> -->
                              <div
                                v-else-if="
                                  item.type.name.toLowerCase() === 'float'
                                "
                                class="inputTd"
                              >
                                <Form
                                  :model="item"
                                  :rules="ruleCustom"
                                  ref="item"
                                >
                                  <FormItem
                                    prop="default"
                                    :rules="[
                                      {
                                        validator: (rule, value, callback) => {
                                          let data = item;
                                          if (
                                            !data.hasOwnProperty('constraint')
                                          )
                                            callback();
                                          let min = data.constraint.min;
                                          let max = data.constraint.max;
                                          let num = parseFloat(value);
                                          var reg = /-?[0-9]*\.?[0-9]+/;
                                          if (
                                            new RegExp(reg).test(value) == false
                                          ) {
                                            if (max == undefined) {
                                              callback(
                                                '请输入' + min + '以上的值'
                                              );
                                            } else
                                              callback(
                                                '请输入' +
                                                  min +
                                                  '-' +
                                                  max +
                                                  '之间的值'
                                              );
                                          } else {
                                            if (max == undefined) {
                                              if (num >= min) callback();
                                              else
                                                callback(
                                                  '请输入' + min + '以上的值'
                                                );
                                            } else {
                                              if (num >= min && num <= max)
                                                callback();
                                              else {
                                                if (max == undefined)
                                                  callback(
                                                    '请输入' + min + '以上的值'
                                                  );
                                                else
                                                  callback(
                                                    '请输入' +
                                                      min +
                                                      '-' +
                                                      max +
                                                      '之间的值'
                                                  );
                                              }
                                            }
                                          }
                                        },
                                      },
                                    ]"
                                  >
                                    <Input
                                      v-model="item.default"
                                      clearable
                                      autocomplete="off"
                                      placeholder="请输入浮点数"
                                    />
                                  </FormItem>
                                </Form>
                              </div>

                              <CInput
                                v-else
                                v-model="item.default"
                                clearable
                                class="inputTd"
                                :placeholder="`${item.desc}`"
                              />
                            </td>
                          </template>
                        </CDataTable>
                      </td>
                    </tr>
                    <tr
                      v-for="(item2, index) in inputDisplayParamItems"
                      :key="index"
                      v-show="showInputParameter"
                    >
                      <td>
                        <div class="tbHeader">
                          <span style="float: left">{{ item2.groupName }}</span>

                          <CButton
                            :id="`${item2.groupName}_${index}`"
                            class="hoverstyle imgBtn"
                            :title="'显示更多参数'"
                            variant="outline"
                            color="info"
                            :flag="'display'"
                            @click="displayDtParamBtn(item2, index)"
                          >
                            <img class="jia" :src="tdRightImg('plus')" alt />
                          </CButton>
                        </div>
                        <CDataTable
                          :key="item2"
                          :items="item2"
                          :fields="fields"
                          :class="
                            `${item2.length}` < 1
                              ? 'paramTable paramTable1 '
                              : 'paramTable'
                          "
                          :header="haveHeader"
                          border
                          hover
                        >
                          <template #value="{ item }" style="width: 60%">
                            <td>
                              <CSelect
                                v-if="item.type.name.toLowerCase() === 'select'"
                                horizontal
                                :options="item.constraint"
                                :value.sync="item.default"
                                class="inputSelectTd"
                                placeholder="请选择"
                              ></CSelect>
                              <CSelect
                                v-else-if="
                                  item.type.name.toLowerCase() === 'boolean'
                                "
                                horizontal
                                :options="[
                                  { label: '请选择', value: '' },
                                  { label: '是', value: true },
                                  { label: '否', value: false },
                                ]"
                                :value.sync="item.default"
                                class="inputSelectTd"
                              ></CSelect>
                              <div
                                v-else-if="
                                  item.type.name.toLowerCase() === 'dir'
                                "
                              >
                                <template>
                                  <CInput
                                    v-model="item.default"
                                    clearable
                                    autocomplete="off"
                                    class="inputTd"
                                    :title="item.default"
                                    :placeholder="`${item.desc}`"
                                  />
                                  <CButton
                                    color="info"
                                    size="sm"
                                    @click="browserFile(item)"
                                    class="btnBrowser"
                                    >...</CButton
                                  >
                                </template>
                              </div>
                              <div
                                v-else-if="
                                  item.type.name.toLowerCase() === 'file'
                                "
                              >
                                <template horizontal>
                                  <CInput
                                    v-model="item.default"
                                    clearable
                                    autocomplete="off"
                                    class="inputTd"
                                    :title="item.default"
                                    :placeholder="`${item.desc}`"
                                  />
                                  <CButton
                                    color="info"
                                    size="sm"
                                    @click="browserFile(item)"
                                    class="btnBrowser"
                                    >...</CButton
                                  >
                                </template>
                              </div>
                              <div
                                v-else-if="
                                  item.type.name.toLowerCase() === 'spatialref'
                                "
                              >
                                <template>
                                  <CInput
                                    v-model="item.default"
                                    clearable
                                    autocomplete="off"
                                    class="inputTd"
                                    :title="item.default"
                                    :placeholder="`${item.desc}`"
                                  />
                                  <CButton
                                    color="info"
                                    size="sm"
                                    @click="browserRef(item)"
                                    class="btnBrowser"
                                    >...</CButton
                                  >
                                </template>
                              </div>
                              <!-- <CInput v-else v-model="item.default" class="inputTd"></CInput> -->
                              <div
                                v-else-if="
                                  item.type.name.toLowerCase() === 'float'
                                "
                                class="inputTd"
                              >
                                <Form
                                  :model="item"
                                  :rules="ruleCustom"
                                  ref="item"
                                >
                                  <FormItem
                                    prop="default"
                                    :rules="[
                                      {
                                        validator: (rule, value, callback) => {
                                          let data = item;
                                          if (
                                            !data.hasOwnProperty('constraint')
                                          )
                                            callback();
                                          let min = data.constraint.min;
                                          let max = data.constraint.max;
                                          let num = parseFloat(value);
                                          var reg = /-?[0-9]*\.?[0-9]+/;
                                          if (
                                            new RegExp(reg).test(value) == false
                                          ) {
                                            if (max == undefined) {
                                              callback(
                                                '请输入' + min + '以上的值'
                                              );
                                            } else
                                              callback(
                                                '请输入' +
                                                  min +
                                                  '-' +
                                                  max +
                                                  '之间的值'
                                              );
                                          } else {
                                            if (max == undefined) {
                                              if (num >= min) callback();
                                              else
                                                callback(
                                                  '请输入' + min + '以上的值'
                                                );
                                            } else {
                                              if (num >= min && num <= max)
                                                callback();
                                              else {
                                                if (max == undefined)
                                                  callback(
                                                    '请输入' + min + '以上的值'
                                                  );
                                                else
                                                  callback(
                                                    '请输入' +
                                                      min +
                                                      '-' +
                                                      max +
                                                      '之间的值'
                                                  );
                                              }
                                            }
                                          }
                                        },
                                      },
                                    ]"
                                  >
                                    <Input
                                      v-model="item.default"
                                      clearable
                                      autocomplete="off"
                                      placeholder="请输入浮点数"
                                    />
                                  </FormItem>
                                </Form>
                              </div>

                              <CInput
                                v-else
                                v-model="item.default"
                                clearable
                                class="inputTd"
                                :placeholder="`${item.desc}`"
                              />
                            </td>
                          </template>
                        </CDataTable>
                      </td>
                    </tr>
                  </tbody>
                </table>
              </div>
            </main>
          </div>
          <big-img v-if="showImg" @clickit="viewImg" :imgSrc="imgSrc"></big-img>
        </CCard>

        <CCard class="rightCard" style="width: 37%">
          <CTextarea
            label="任务描述"
            placeholder="流程描述"
            v-model="taskdesc"
            horizontal
            disabled
          />
          <label class="processGraph">流程图</label>
          <div class="picDiv">
            <img
              :src="picture"
              alt
              ref="img1"
              class="img1"
              @click="clickImg($event)"
            />
          </div>
        </CCard>
      </CRow>
      <template #footer>
        <div class="footDiv">
          <div style="text-align: center">
            <CButton
              @click="submit"
              color="info"
              class="btn1"
              style="width: 82px"
              data-permission="Btn_Process_Run"
              title="流程执行"
              >执行</CButton
            >
            <!-- <CButton @click="batchParamCheck" color="info" class="btn1">参数校验</CButton> -->
            <CButton
              @click="showCreateTaskModalx"
              color="info"
              class="btn1 delBtn"
              style="width: 82px"
              >取消</CButton
            >
          </div>
          <div class="radioRight">
            <CInputCheckbox
              label="保存默认参数"
              type="radio"
              :checked.sync="defaultParamRadio"
              value="保存默认参数"
            />
          </div>
        </div>
      </template>
    </Modal>

    <Modal
      v-model="showZtreeModal"
      draggable
      scrollable
      title="选择目录"
      :width="800"
      class="menuModal"
    >
      <p slot="header" class="modalHeader">选择目录</p>
      <CButtonClose slot="close" @click="menuCancel" />
      <!-- <CModal
      title="选择目录"
      color="info"
      :show.sync="showZtreeModal"
      :closeOnBackdrop="false"
      size="lg"
      centered
      class="menuModal"
    > -->
      <div style="height: 60px">
        <div>
          <!-- <CLink class="px-2">本地文件</CLink>
          <br>-->
          <CLink class="px-2" @click="shareMenu(currenItem)">共享文件夹</CLink>
          <br />
          <CLink class="px-2" @click="userMenu(currenItem)">用户文件夹</CLink>
          <!-- <br>
          <CLink class="px-2" >数据订单</CLink>-->
        </div>
        <div class="optiostyle displaySuffix" style="display: none">
          <div>
            <CInputCheckbox
              label="任务拆分"
              type="radio"
              title="'是否将任务拆分成多个任务'"
              :checked.sync="isBatch"
              value="是否批量"
            />
          </div>
          <div style="width: 62%">
            <CSelect
              label="筛选"
              horizontal
              :options="suffix"
              :value.sync="currenSelectSuffix"
              @change="suffixSearch()"
              class="selectSuffix"
            ></CSelect>
          </div>
          <!-- <CButton color="info" @click="suffixSearch" class="suffixBtn">过滤</CButton> -->
        </div>
        <div class="myFileDiv displaySuffix" style="display: none">
          <CButton
            v-if="isShowMyFile"
            color="info"
            @click="MyFileClicked"
            class="myFileBtn"
            >文件管理</CButton
          >
        </div>
      </div>
      <div class="treeDiv">
        <ul id="treeDemo" class="ztree"></ul>
      </div>
      <template #footer>
        <CButton
          @click="menuSaveAs"
          color="info"
          title="点击文件夹即可，不需要打钩选中哦~"
          >另存为</CButton
        >
        <CButton @click="menuOk" color="info" style="width: 68px">确定</CButton>
        <CButton
          @click="menuCancel"
          color="info"
          class="delBtn"
          style="width: 68px"
          >取消</CButton
        >
      </template>
    </Modal>

    <Modal
      v-model="saveAsModal"
      draggable
      scrollable
      title="新增"
      class="menuModal"
      :styles="modalStyle"
    >
      <p slot="header" class="modalHeader">新增</p>
      <CButtonClose slot="close" @click="saveAsFileCancel" />
      <div class="saveFile">
        <CInput
          label="文件:"
          class="saveFileStyle"
          horizontal
          v-model="newFileName"
        />
      </div>
      <div class="saveFolder">
        <CInput
          label="文件夹:"
          class="saveFileStyle"
          horizontal
          v-model="newFileName"
        />
      </div>
      <template #footer>
        <CButton @click="saveAsFileOK" color="info">确定</CButton>
        <CButton @click="saveAsFileCancel" color="info">取消</CButton>
      </template>
    </Modal>

    <Modal
      v-model="showZtreeRefModal"
      draggable
      scrollable
      title="选择空间参考"
      :width="800"
      class="menuModal"
    >
      <p slot="header" class="modalHeader">选择空间参考</p>
      <CButtonClose slot="close" @click="menuCancel" />

      <div class="treeDiv">
        <ul id="treeDemo1" class="ztree"></ul>
      </div>

      <template #footer>
        <CButton @click="menuRefOk" color="info">确定</CButton>
        <CButton @click="menuCancel" color="light ">取消</CButton>
      </template>
    </Modal>

    <Modal
      v-model="batchParamModal"
      draggable
      scrollable
      title="批量参数比对"
      :width="800"
      class="menuModal"
    >
      <p slot="header" class="modalHeader">批量参数比对</p>
      <CButtonClose slot="close" @click="menuCancel" />
      <div>
        <CRow>
          <CCol sm="6" v-for="(items1, index) in paramList" :key="index">
            <div>{{ items1.label }}：</div>
            <select multiple class="batchSelect">
              <option
                v-for="(itemsli, index) in items1.defaultList"
                :key="index"
                @click="liClick(items1, index)"
                :title="itemsli"
              >
                {{ itemsli }}
              </option>
            </select>
          </CCol>
        </CRow>
      </div>
      <template #footer>
        <div style="float: left; width: 41%">
          <button @click="moveUp()" class="btn1" style="border: none">
            <img src="../../assets/icons/up.png" alt title="上移" />
          </button>
          <button @click="moveDown()" class="btn1" style="border: none">
            <img src="../../assets/icons/down.png" alt title="下移" />
          </button>
        </div>
        <CButton @click="batchCheckOk" color="info">确定</CButton>
        <CButton @click="batchCheckCancel" color="light ">取消</CButton>
      </template>
    </Modal>

    <Modal
      v-model="displayProductionLineGraphs"
      draggable
      scrollable
      title="查看流程图"
      class="mdoal flowChartModal"
      :width="800"
    >
      <p slot="header" class="modalHeader">查看流程图</p>
      <CCardBody style="text-align: center">
        <img :src="picture" alt class="styImg" />
      </CCardBody>
      <template #footer>
        <CButton @click="displayProductionLineGraphs = false" color="info"
          >返回</CButton
        >
      </template>
    </Modal>

    <Modal
      v-model="processfilterModal"
      draggable
      scrollable
      title="算法流程过滤"
      :width="800"
      class="menuModal"
    >
      <p slot="header" class="modalHeader">算法流程过滤</p>
      <CCardBody style="text-align: center">
        <CSelect
          label="卫星/传感器"
          class="processFileterDiv"
          horizontal
          :options="sensorOption"
          :value.sync="sensorOptionValue"
        />
        <div style="float: left">产品类型</div>
        <div class="inputRadioDiv2">
          <CInputRadio
            v-for="(item, index) in productionType"
            :key="index"
            type="radio"
            :label="item.label"
            :checked="item.isCheck"
            @change="changeInputProductionType(index)"
            class="inputRadio"
          />
        </div>
        <div class="formstyle" v-show="isRegion">
          <span style="float: left; margin-top: 6px">区域</span>
          <Cascader
            :data="regionCascader"
            change-on-select
            filterable
            class="regionCas"
            :load-data="loadRegionData"
          ></Cascader>
        </div>
        <CSelect
          label="算法模型"
          class="processFileterDiv"
          horizontal
          :options="algoTypeOption"
          :value.sync="algoTypeOptionValue"
        />
      </CCardBody>

      <template #footer>
        <CButton @click="filterOk" color="info">确定</CButton>
        <CButton @click="filteCancel" color="light ">取消</CButton>
      </template>
    </Modal>

    <CModal
      title="文件管理"
      color="info"
      size="xl"
      :show.sync="myFileModal"
      :closeOnBackdrop="false"
      centered
    >
      <template #header>
        <h5 class="modal-title">文件管理</h5>
        <CButtonClose @click="myFileCancel" />
      </template>

      <CCardBody>
        <div>
          <iframe
            :src="url"
            scrolling="no"
            marginheight="0"
            marginwidth="0"
            class="iframe"
          ></iframe>
        </div>
      </CCardBody>

      <template #footer>
        <CButton @click="myFileOk" color="info">确定</CButton>
        <CButton @click="myFileCancel" color="light" style="height: 40px"
          >取消</CButton
        >
      </template>
    </CModal>
  </div>
</template>

<!--js代码-->
<script>
// import loading from "../../../src/plugins/loading/loading"
import DatePickers from "../../plugins/date-pickers";
const items = [];
const typeOption = {
  0: "image",
  1: "parameter",
};

const fields = [
  //  { key: "groupName", label: "组名", _style: "width:20%" },
  { key: "label", label: "参数名称", _style: "width:20%;" },
  { key: "value", label: "参数值", _style: "width:80%;" },
];
const listproductLine = [];
export default {
  name: "common",
  data() {
    var validateuser = function (rule, value, callback) {
      if (!value) {
        return callback(new Error("请输入用户名"));
      } else if (!/^[a-zA-Z\d]+$/.test(value)) {
        return callback(new Error("请正确输入用户名"));
      } else {
        callback();
      }
    };
    var validateAge = (rule, value, callback) => {
      if (!Number.isInteger(+value)) {
        callback(new Error("请输入数字"));
      } else {
        callback();
      }
    };
    var validateCount = (rule, value, callback) => {
      if (!Number.isInteger(+value)) {
        callback(new Error("请输入数字"));
      } else if (Number.isInteger(+value)) {
        let num = Number(value);
        let length = value.length;
        if (length < 3) {
          callback(new Error("请输入长度为3的数字"));
        } else {
          callback();
        }
      } else {
        callback();
      }
    };
    return {
      modalStyle: { top: "340px" },
      ztreeInstanceOfReference: null,
      ztreeInstanceOfFile: null,
      globalDisplayBtn: false, //基本参数的显示按钮展开状态
      isExcute: false,
      processfilterModal: false,
      displayProductionLineGraphs: false,
      taskdesc: "",
      hiddenDtParam: [], //表格隐藏参数
      displayDtParam: [], //表格显示参数
      // loading: true,
      showImg: false,
      imgSrc: "",
      showInputParameter: false,
      showGlobalParameter: false,

      url: "",
      myFileModal: false,
      isShowMyFile: false,

      validateCount: validateCount,

      ruleCustom: {
        age: [
          { required: true, message: "年龄不能为空", trigger: "blur" },
          { validator: validateAge, trigger: "blur" },
        ],
        count: [
          { required: true, message: "数量不能为空", trigger: "blur" },
          { validator: validateCount, trigger: "blur" },
        ],
        default: [
          { required: true, message: "请输入数字", trigger: "blur" },
          { validator: validateCount, trigger: "blur" },
        ],
      },

      paramList: [],
      batchParamModal: false,
      isBatch: true,
      id: "", //流程线父(组)ID
      type: "", //流程类型 image：影像 parameter：参量
      typeOption: typeOption, //流程类型内容模型 目前就两种 image parameter 可追加 避免后期代码中类型写死
      taskType: "", //提交任务类型
      userName: "",

      listproductLine: [], //算法选择参数
      options: [
        //优先级
        { label: "普通", value: "0", isCheck: true },
        { label: "优先", value: "1", isCheck: false },
      ],

      /***************** start 以下为参量属性设置 ************************/
      timeRow: false,
      sensorRow: false,
      productionTypeRow: false,
      algoModelRow: false,
      productionLineRow: true,

      timeType: "month",
      timePlaceholder: "请选择月份",
      timeFormat: "yyyy-MM",
      currentTime: new Date(),

      timeList: [
        { label: "月度", value: "月度", isCheck: true },
        // { label: "季度", value: "季度", isCheck: false },//暂时隐藏
        { label: "年度", value: "年度", isCheck: false },
      ],

      mixType: [
        { label: "最小值", value: "Min ", isCheck: true },
        { label: "最大值", value: "Max", isCheck: false },
        { label: "累计值", value: "Acc", isCheck: false },
        { label: "均值", value: "Ave", isCheck: false },
        { label: "加权平均值", value: "WAve", isCheck: false },
      ],
      mixTypeValue: "Min",
      productionType: [
        { label: "单景产品", value: "单景产品", isCheck: true },
        // { label: "合成产品", value: "合成产品", isCheck: false },
      ],

      productionTypeValue: "单景产品",
      sensorOption: [],
      sensorOptionValue: 0,
      algoTypeOption: [],
      algoTypeOptionValue: 0,
      filterLabels: "", //参量流程筛选条件标签
      regionTitle: "",
      regionCascader: [
        {
          label: "全国",
          value: 0,
          loading: false,
          tag: "china",
          code: 0,
          children: [],
        },
        // { label: "其他", value: 1, loading: false, tag: "other", code:1,children: [] },
      ], //级联选择
      cascaderValue: [],
      isRegion: false,
      region: {
        name: "",
        geometry: "",
      },
      regionType: [
        { label: "行政区", value: "xzq ", isCheck: true },
        // { label: "其他", value: "other", isCheck: false },
      ],
      currentRegionType: "xzq",
      /*****************end 以上为参量属性设置 ************************/
      suffix: [],
      currenSelectSuffix: "",
      // items: items.map((item, id) => {
      //   return { ...item, id };
      // }),
      items: [],
      globalItems: undefined,
      inputDisplayParamItems: [], //表格默认显示
      inputParamItems: [], //表格显示和隐藏全部参数
      fields,
      taskName: "",
      currenItem: "",
      workflowId: "",
      workflowName: "",
      picture: "",
      priorityLevel: 0,
      showCreateTaskModal: false,
      showZtreeModal: false,
      showZtreeRefModal: false,
      saveAsModal: false,
      isRefModal: false,
      newFileName: "",
      isFile: false,
      defaultParamRadio: false,
      testModal: false,
      haveHeader: false,
      selectBatchParamData: new Object(),
    };
  },
  watch: {
    $route: {
      handler() {
        this.id = this.$route.params.id;
        this.type = this.$route.params.type;
        this.getProduct();
      },
      deep: true,
    },
    taskName(newVal, oldVal) {
      if (newVal.length >= 50) {
        // this.$Message.error("任务名称长度不得超过50个字符");
      }
    },
    isExcute(newVal, oldVal) {
      if (newVal == true) {
        this.toRoute();
      }
    },
    // showCreateTaskModal(newVal, oldVal) {
    //   if (newVal == false) {
    //     this.toRoute();
    //   }
    // },
    inputDisplayParamItems: {
      handler(newval, oldval) {},
      deep: true,
    },
  },
  created() {},

  mounted() {
    this.id = this.$route.params.id;
    this.type = this.$route.params.type;
    let name = this.$route.name;
    if (name === "commonProcess") {
      this.taskType = 2;
    } else if (name === "commonQualityCheck") {
      this.taskType = 1;
    }

    this.layoutByType();
    this.getProduct();
    let user = this.$store.state.user;
    if (user == null) {
      this.userName = null;
    } else {
      this.userName = user.userName;
    }
  },
  methods: {
    //根据数据的类型和模块 控制界面的显示 image 影像 parameter 参量 参量界面只在处理加工界面 质检不涉及
    layoutByType() {
      let type = this.type;
      if (type === this.typeOption[1] && this.taskType === 2) {
        this.sensorRow = true;
        this.productionTypeRow = true;
        this.algoModelRow = true;
      }
    },
    toRoute() {
      if (this.taskType == 1) {
        this.$router.push({
          path: "/qualityCheck",
          query: {
            from: "qualityCheckCommon",
          },
        });
      } else if (this.taskType == 2) {
        this.$router.push({
          path: "/processing",
          query: {
            from: "processingCommon",
          },
        });
      }
    },
    tdRightImg(type) {
      let img = {
        plus: require("./../../assets/icons/leftArrow.svg"),
        reduce: require("./../../assets/icons/downArrow.svg"),
      };
      return img[type];
    },
    processFilter() {
      this.processfilterModal = true;
    },
    clickImg(e) {
      this.displayProductionLineGraphs = true;
      return;
      // this.showImg = true;
      // // 获取当前图片地址
      // this.imgSrc = e.currentTarget.src;
    },

    // viewImg() {
    //   this.showImg = false;
    // },

    // ----------------------------以下批量参数比对功能部分 ---------------------------------//
    batchCheckOk() {
      this.batchParamModal = false;
      let batchData = this.paramList;
      let tableData = this.items;
      let flag = 0;
      for (let i in batchData) {
        //目的是替换表格数据this.items中对应的批量数据替换
        let temp = batchData[i];
        let info = "";
        for (let m in temp.defaultList) {
          if (info == "") info = temp.defaultList[m];
          else info += "#HT#" + temp.defaultList[m];
        }
        for (let j in tableData) {
          //比对表格this.items中每个算法下每个参数的workflowInputKey是否相对 y 替换 n 不变
          let tempData = tableData[j];
          for (let n in tempData) {
            let tempData2 = tempData[n];
            if (temp.workflowInputKey === tempData2.workflowInputKey) {
              this.$nextTick(function () {
                this.$set(this.items[j][n], "default", info);
              });
              flag++;
            }
            if (flag == batchData.length) break;
          }
          if (flag == batchData.length) break;
        }
      }
    },
    batchCheckCancel() {
      this.batchParamModal = false;
    },
    moveUp() {
      let childrenData = this.selectBatchParamData;
      let index = this.getIndex();
      let list = [];
      list = childrenData.data.defaultList;
      let childIndex = childrenData.index;
      if (list.length > 1 && childIndex != 0) {
        var temp = list[childIndex - 1];
        list[childIndex - 1] = list[childIndex];
        list[childIndex] = temp;
        this.paramList[index].defaultList = [];
        this.$nextTick(function () {
          this.$set(this.paramList[index], "defaultList", list);
        });
      }
    },
    moveDown() {
      let childrenData = this.selectBatchParamData;
      let index = this.getIndex();
      let list = [];
      list = childrenData.data.defaultList;
      let childIndex = childrenData.index;
      if (list.length > 1 && childIndex != list.length - 1) {
        var temp = list[childIndex + 1];
        list[childIndex + 1] = list[childIndex];
        list[childIndex] = temp;
        this.paramList[index].defaultList = [];
        this.$nextTick(function () {
          this.$set(this.paramList[index], "defaultList", list);
        });
      }
    },
    getIndex() {
      let data = this.paramList;
      let childrenData = this.selectBatchParamData;
      //1 根据childrenData得到在父data数组中的索引值
      //2、改变childrenData的上移和下移动后的数据
      //3、根据索引值改变data的对应的值用移动后的数据替换
      let index = 0;
      let flag = false;
      for (let i in childrenData) {
        let tempData = childrenData[i].workflowInputKey;
        for (let j in data) {
          let tempData1 = data[j].workflowInputKey;
          if (tempData === tempData1) {
            index = j;
            flag = true;
            break;
          }
        }
        if (flag) break;
      }
      return index;
    },

    liClick(item, index) {
      let obj = new Object();
      obj.data = item;
      obj.index = index;
      this.selectBatchParamData = obj;
    },

    //批量参数校验 初始化参数
    batchParamCheck() {
      let dataList = this.items;
      let newDataList = [];
      let list = [];
      let obj = new Object();
      for (var i in dataList) {
        for (let j in dataList[i]) {
          let tempData = dataList[i][j];
          obj = tempData;
          if (
            tempData.type.name.toLowerCase() === "file" ||
            tempData.type.name.toLowerCase() === "dir"
          ) {
            if (
              tempData.workflowInputKey.indexOf("pan") != -1 ||
              tempData.workflowInputKey.indexOf("mss") != -1
            ) {
              if (
                tempData.type.plural &&
                tempData.default.indexOf("#HT#") != -1
              ) {
                let tempList1 = tempData.default.split("#HT#");
                obj.defaultList = tempList1;
                newDataList.push(obj);
              }
            }
          }
        }
      }
      this.paramList = newDataList;
      if (newDataList.length > 0) this.batchParamModal = true;
      else this.$Message.info("没有可以比对的数据");
    },

    // ----------------------------以上批量参数比对功能部分 ---------------------------------//
    showCreateTaskModalx() {
      this.showCreateTaskModal = false;
      this.toRoute();
    },

    //对应流程线的流程图
    displayProductionLineGraph() {
      let workFlowId = this.workflowId;
      let path =
        this.GlobalUrlPath.productManage.loopUpGraph +
        workFlowId +
        "/findPicture";
      this.picture = path;
    },

    getProduct() {
      let _this = this;
      // if (_this.type === _this.typeOption[0]) {
      //   _this.getCommonProduct();
      // } else if (_this.type === _this.typeOption[1]&&_this.taskType===2) {
      //   _this.getParameterFilterLabels();
      // }

      if (_this.type === _this.typeOption[1] && _this.taskType === 2) {
        _this.getParameterFilterLabels();
      } else {
        _this.getCommonProduct();
      }
    },

    getCommonProduct() {
      let _this = this;
      let path = _this.GlobalUrlPath.productManage.query; //search query
      let labels = _this.filterLabels;
      if (labels == "") {
        labels = null;
      } else {
        labels = encodeURIComponent(JSON.stringify(_this.filterLabels));
      }

      let param = {
        groupId: _this.id,
        labels: labels, //标签编号
      };

      _this.http.get(path, param).then((res) => {
        let data = res.data;
        if (data.code == 0) {
          if (data.data.length > 0) {
            _this.showCreateTaskModal = true;

            let tempList = [];
            for (var item in data.data) {
              let tempItem = data.data[item];
              if (item == 0) {
                tempItem["isCheck"] = true;
              } else {
                tempItem["isCheck"] = false;
              }
              tempList.push(tempItem);
            }
            _this.listproductLine = tempList;
            if (
              _this.type === _this.typeOption[1] &&
              tempList.length <= 1 &&
              _this.taskType === 2
            ) {
              _this.productionLineRow = false;
            } else {
              _this.productionLineRow = true;
            }
            _this.workflowId = data.data[0].id;
            _this.taskdesc = tempList[0].description;
            _this.displayProductionLineGraph();

            _this.getParamList(); // 动态获取参数;

            let currentTime = _this.getTime(); //任务名称
            _this.taskName =
              data.data[0].workflowName +
              "_" +
              _this.userName +
              "_" +
              currentTime;
          } else {
            // _this.showCreateTaskModal = false;
            _this.items = [];
            _this.listproductLine = [];
            _this.displayProductionLineGraph();
            _this.inputDisplayParamItems = [];
            _this.globalItems = [];

            if (confirm("未查到，是否显示全部")) {
              _this.filterLabels = "";
              _this.getCommonProduct();
            } else {
              _this.showGlobalParameter = false;
            }
          }
        } else {
          this.$Message.error(res.data.message);
        }
      });
    },

    getParameterFilterLabels() {
      let _this = this;
      let path = _this.GlobalUrlPath.productManage.queryProcessLabels;
      let param = {
        groupId: _this.id,
      };
      _this.sensorOption = [];
      _this.algoTypeOption = [];
      _this.http.get(path, param).then((res) => {
        let data = res.data;
        if (data.code == 0 && data.success) {
          let labelData = data.data;
          _this.showCreateTaskModal = true;
          let productionType = [];

          Object.keys(labelData).forEach(function (key) {
            let tempDataArr = labelData[key];
            tempDataArr.forEach((ele, index) => {
              let value = {};
              value[key] = [];
              value[key].push(ele);

              // value["AQUA/TERRA-MODIS"] = [];
              // value["AQUA/TERRA-MODIS"].push(ele);

              let obj = {};
              obj.label = ele;
              obj.value = value;
              obj.isCheck = false;

              // ProducType-产品类型: ["单景产品"]
              if (key.indexOf("SatelliteSensor") != -1) {
                let fist = key.split("-")[0].length;
                let resultData = key.substring(fist + 1, key.length);

                // if (ele.toLowerCase() === "modis") {
                //   //  obj.label=//AQUA-MODIS
                //   // (item => item.name == data.name);
                //   // let tempItem = _this.sensorOption.filter(
                //   //   (item) => item.label.toLowerCase() === "modis"
                //   // );

                //   obj.label = "AQUA/TERRA-MODIS";
                // } else {
                //   obj.label = resultData + "-" + ele;
                // }

                obj.label = resultData + "-" + ele;
                _this.sensorOption.push(obj);
              } else if (key.indexOf("ProducClass") != -1) {
                _this.algoTypeOption.push(obj);
              } else if (key.indexOf("ProducType") != -1) {
                productionType.push(obj);
              }
            });
          });

          _this.sensorOptionValue =
            _this.sensorOption.length < 1 ? "" : _this.sensorOption[0].value;
          _this.algoTypeOptionValue =
            _this.algoTypeOption.length < 1
              ? ""
              : _this.algoTypeOption[0].value;

          let value1 = { "ProducType-产品类型": ["单景产品"] };
          _this.productionTypeValue = value1;

          // _this.productionTypeValue =
          //   productionType.length < 1 ? value1 : productionType[0].value;

          _this.filterProcessByConditons();
        } else {
          this.$Message.error(res.message);
        }
      });
    },

    //流程任务执行
    submit() {
      let _this = this;
      if (this.taskName == "") {
        this.$Message.warning("任务名称没有填哦！");
        return;
      }

      if (this.taskName.length > 50) {
        this.$Message.warning("任务名称不能超过50个字符");
        return;
      }
      // let inputParamData = this.inputParamItems;
      let defaultParam = { inputParam: [] };
      defaultParam.globalParam = this.globalItems; //globalParam
      _this.dealWithSubmitInputParameter(defaultParam); //inputParam

      let submitPath = this.GlobalUrlPath.processProduct.submitTask;

      let params = {
        item: JSON.stringify(defaultParam),
        workflowId: this.workflowId,
        name: this.taskName,
        priorityLevel: this.priorityLevel,
        userId: 0,
        taskType: this.taskType, //1 质检 2 数据处理
        isSaveDefaultParameter: this.defaultParamRadio,
      };

      let dd = {};
      dd["time"] = _this.currentTime;
      dd["mixTypeValue"] = _this.mixTypeValue;
      dd["region"] = JSON.stringify(_this.region);

      console.log("参量合成测试参数查看:" + JSON.stringify(dd));
      console.log("任务创建提交参数", params);
      debugger;
      this.showCreateTaskModal = false;

      this.http.post(submitPath, params).then((res) => {
        _this.isExcute = true;
        if (res.data.success) {
          this.$Message.success("提交任务成功");
        } else {
          this.$Message.error("提交失败:" + res.data.message);
        }
      });
    },

    //radio算法选择显示流程参数切换
    search(item, index) {
      this.workflowId = item.id;
      this.taskdesc = item.description;
      this.getParamList();
      this.displayProductionLineGraph();
    },

    dealWithSubmitInputParameter(defaultParam) {
      let _this = this;
      let inputParamData = this.inputParamItems;
      for (var i in inputParamData) {
        let inputData = inputParamData[i];
        let productionTypeValue = JSON.stringify(_this.productionTypeValue);
        if (
          productionTypeValue.indexOf("合成") != -1 &&
          inputData[0].groupAlgoId === "piesat.java.generate_production_name"
        ) {
          _this.dealWithMixProductData("paramMix", inputData);
        }
        if (
          productionTypeValue.indexOf("合成") != -1 &&
          inputData[0].groupAlgoId.indexOf("piesat.basic.img_clip") != -1
        ) {
          //algoId: piesat.basic.img_clip_enhance; piesat.basic.img_clip
          _this.dealWithMixProductData("imgClip", inputData);
        }
        if (
          productionTypeValue.indexOf("合成") != -1 &&
          inputData[0].groupAlgoId.indexOf(
            "piesat.basic.create_metadata_synthesis"
          ) != -1
        ) {
          debugger;
          _this.dealWithMixProductData("metadata", inputData);
        }

        defaultParam.inputParam.push(inputData);
      }
    },
    dealWithMixProductData(type, data) {
      //参量-合成产品 所需要的的提交区域和时间尺度
      data.forEach((ele) => {
        switch (type) {
          case "paramMix":
            if (ele.name === "region") {
              ele.default = this.region.name;
            } else if (ele.name === "submitTime") {
              let time = this.currentTime.split("-").join("");
              if (time.length > 4 && time.length < 7) time = time + "m"; //month
              ele.default = time;
            } else if (ele.name === "method") {
              ele.default = this.mixTypeValue;
            }
            break;
          case "imgClip":
            if (ele.name === "InputGeoJson" || ele.name === "ClipRange") {
              ele.default = this.region.geometry;
              break;
            }
            break;
          case "metadata":
            if (ele.name === "RegionType") {
              // ele.default = this.region.classify;
            } else if (ele.name === "RegionCode") {
              ele.default = this.region.code;
            } else if (ele.name === "RegionName") {
              ele.default = this.region.name;
            }
            break;
        }
      });
    },

    dateFormat(fmt, date) {
      if (date == undefined) {
        date = new Date();
        this.dateFormat("YYYY-mm", date);
        return;
      }
      if (date.toString().indexOf("-") != -1) return;
      let ret;
      const opt = {
        "Y+": date.getFullYear().toString(), // 年
        "m+": (date.getMonth() + 1).toString(), // 月
        "d+": date.getDate().toString(), // 日
        "H+": date.getHours().toString(), // 时
        "M+": date.getMinutes().toString(), // 分
        "S+": date.getSeconds().toString(), // 秒
        // 有其他格式化字符需求可以继续添加，必须转化成字符串
      };
      for (let k in opt) {
        ret = new RegExp("(" + k + ")").exec(fmt);
        if (ret) {
          fmt = fmt.replace(
            ret[1],
            ret[1].length == 1 ? opt[k] : opt[k].padStart(ret[1].length, "0")
          );
        }
      }
      return fmt;
    },
    getParamList() {
      // this.getParamListNew()
      // return
      let _this = this;
      let workflowId = _this.workflowId;
      console.log("点击的workflowId", workflowId);

      this.globalDisplayBtn = false;
      let user = _this.$store.getters.getUser;
      if (user == null || !user.hasOwnProperty("token")) return;

      let defaultPath =
        _this.GlobalUrlPath.processProduct.searchProcessParameters;
      let param = {
        workFlowId: workflowId,
      };

      _this.http.get(defaultPath, param).then((res) => {
        _this.displayDtParam = []; //表格显示数据置空
        _this.hiddenDtParam = [];

        let data = res.data;
        if (data.success) {
          let inputParam = JSON.parse(data.data.processParameters).inputParam;
          let globalParam = JSON.parse(data.data.processParameters).globalParam;
          let params = JSON.parse(data.data.processParameters);

          if (globalParam != undefined)
            this.dealWithGlobalParameterBeforeRender(globalParam);

          //算法参数显示&&隐藏
          _this.showInputParameter = true;
          for (let i = 0; i < inputParam.length; i++) {
            let temp = inputParam[i];
            let workflowInputKey = inputParam.workflowInputKey;
            _this.dealWithAlgoParameterBeforeRender(temp);
          }
          // let dd = this.displayDtParam;
          // console.log( "勿删---查询算法流程数据：" +"workflowId:" + workflowId + "\r\n" +"data:" + JSON.stringify(params) );
          if (
            params.globalParam == undefined ||
            params.globalParam.length < 1
          ) {
            _this.showInputParameter = true;
            _this.showGlobalParameter = false;

            _this.inputDisplayParamItems = this.displayDtParam; //inputParam;
            _this.inputParamItems = inputParam; //表格参数全部数据
            _this.globalItems = undefined;
          } else {
            _this.showInputParameter = false;
            _this.showGlobalParameter = true;

            _this.inputDisplayParamItems = this.displayDtParam; // inputParam;
            _this.inputParamItems = inputParam;

            _this.globalItems = globalParam;
            // _this.globalItems = JSON.parse(JSON.stringify(globalParam)); //deep copy
          }
        } else {
          _this.$Message.error(res.data.message);
        }
        _this.$nextTick(() => {
          _this.setDisplayHidBtnStyle();
        });
      });
    },
    dealWithGlobalParameterBeforeRender(param) {
      for (let i = 0; i < param.length; i++) {
        let tempData = param[i];
        var Regx = /^[0-9]+$/;
        if (Regx.test(tempData.default)) {
          if (tempData.type.name === "select" && tempData.default != "") {
            tempData.default = parseInt(tempData.default);
          }
        }
      }
    },
    dealWithAlgoParameterBeforeRender(data) {
      let _this = this;
      let display = [];
      let hidden = [];
      let isHaveParameterShow = true; //用于标识算法参数是否全部隐藏了 是 则界面不显示算法的名字（参数的显示隐藏由流程编排复选框控制）
      let count = 0;
      for (let j = 0; j < data.length; j++) {
        let tempValue = data[j];
        let defaultVal = tempValue.default;

        //select类型数据单独处理
        if (
          tempValue.type.name.toLowerCase() === "select" &&
          typeof defaultVal === "object"
        ) {
          tempValue.default = defaultVal.value;
        }

        //元数据算法控制生产员 质检员显示
        if (
          tempValue.groupAlgoId === "piesat.basic.create_metadata" ||
          tempValue.groupAlgoId == "piesat.basic.create_metadatapainv"
        ) {
          if (_this.taskType == 1 && tempValue.label.indexOf("生产员") != -1) {
            //质检
            data.splice(j, 1); //删除索引i的1个元素
            j--; //必须有
            continue;
          } else if (
            _this.taskType == 2 &&
            tempValue.label.indexOf("质检员") != -1
          ) {
            //处理加工
            data.splice(j, 1);
            j--;
            continue;
          }

          let value = "";
          if (tempValue.label.indexOf("姓名") != -1) {
            value = _this.$store.state.user.userName;
            tempValue.default = value == null ? "" : value;
          }
          if (tempValue.label.indexOf("部门") != -1) {
            value = _this.$store.state.user.department;
            tempValue.default = value == null ? "" : value;
          }
        }
        /**界面显示分两种
         *  第一种 根据流程编排的参数复选框的选择状态判断:
         *  打钩显示（逻辑按照第二种）   不勾 在页面不管是显示更多还是隐藏都不显示 执行时仍然传到后端（优先级高）
         *  第二种 根据参数值有无判断 有 不显示 没有 则显示
         **/
        if (tempValue.hasOwnProperty("display") && tempValue.display.tag) {
          if (tempValue.display.value) display.push(tempValue);
          else hidden.push(tempValue);
        } else {
          // 在界面不显示 但是执行时该值将传到算法中
          // display.push(tempValue);
          count++;
        }
      }
      if (count == data.length) {
        isHaveParameterShow = false;
      }

      // 显示&&隐藏控制
      if (!isHaveParameterShow) return;
      if (hidden.length < 1) hidden.isDisplay = false;

      display.groupName = data[0].groupName;
      hidden.groupName = data[0].groupName;
      _this.hiddenDtParam.push(hidden); //显示和隐藏的时候需要更新维护
      _this.displayDtParam.push(display); //只在表格初始化的时候用一次
    },

    setDisplayHidBtnStyle() {
      //对显示隐藏按钮样式做判断
      let id = "";

      //基本参数控制算法参数的显示
      if (
        this.globalItems != undefined &&
        this.globalItems.length > 1 &&
        this.inputDisplayParamItems.length > 0
      ) {
        id = "globalParamId";
        let img = $("#" + id).find("img");
        img.show();
        $("#" + id).attr("flag", "display");
        $("#" + id).attr("title", "显示更多参数");
        img.attr("src", this.tdRightImg("plus"));
      } else if (
        this.globalItems != undefined &&
        this.globalItems.length > 1 &&
        this.inputDisplayParamItems.length < 1
      ) {
        id = "globalParamId";
        let img1 = $("#" + id).find("img");
        img1.hide();
      }
      this.setShowOrHidBtnStyle(0); //默认
    },

    /**
     *设置算法参数（不包括基本参数）显示更多和隐藏按钮 
     flag==0 表示无基本参数状态(默认)下 界面初始化
     flag==1 表示在基本参数的情况下 点击基本参数显示更多时的 界面初始化（所有算法参数自动全部展开）
     */
    setShowOrHidBtnStyle(flag) {
      let hiddeItem = this.hiddenDtParam;
      let id = "";
      hiddeItem.forEach((element, index) => {
        id = element.groupName + "_" + index;
        id = this.getFormatId(id);
        let img = $("#" + id).find("img");

        if (flag == 1) {
          $("#" + id).attr("flag", "hidden");
          $("#" + id).attr("title", "隐藏参数");
          img.attr("src", this.tdRightImg("reduce"));
        } else {
          if (element.length < 1) {
            $("#" + id).css("display", "none");
          } else {
            $("#" + id).css("display", "block");
            img.attr("src", this.tdRightImg("plus"));
          }
        }
      });
    },
    //解决Dom元素标签id为特殊字符 根据元素id获取Dom对象失败问题
    getFormatId(srcString) {
      // 转义之后的结果
      var result = srcString;
      // javascript正则表达式中的特殊字符
      var jsSpecialChars = [
        "\\",
        "^",
        "$",
        "*",
        "?",
        ".",
        "+",
        "(",
        ")",
        "[",
        "]",
        "|",
        "{",
        "}",
      ];

      // jquery中的特殊字符,不是正则表达式中的特殊字符
      var jquerySpecialChars = [
        "~",
        "`",
        "@",
        "#",
        "%",
        "&",
        "=",
        "'",
        '"',
        ":",
        ";",
        "<",
        ">",
        ",",
        "/",
      ];

      for (var i = 0; i < jsSpecialChars.length; i++) {
        result = result.replace(
          new RegExp("\\" + jsSpecialChars[i], "g"),
          "\\" + jsSpecialChars[i]
        );
      }

      for (var i = 0; i < jquerySpecialChars.length; i++) {
        result = result.replace(
          new RegExp(jquerySpecialChars[i], "g"),
          "\\" + jquerySpecialChars[i]
        );
      }
      return result;
    },
    displayDtParamBtn(data, index) {
      let id = "";
      let groupName = "";
      let btnName = "";

      if (data === "globalBtn") {
        //基本参数右侧控制按钮
        btnName = "globalBtn";
        id = "globalParamId";
      } else {
        //算法参数右上角显示控制按钮
        groupName = data.groupName; //当前表格算法分组
        id = groupName + "_" + index; //当前td id
        id = this.getFormatId(id);
      }

      let flag = $("#" + id).attr("flag");
      if (flag == "display") {
        //show more
        this.displayAlgoBtnStyle(data, index, id, btnName);
      } else if (flag == "hidden") {
        //hidden more
        this.hiddenAlgoBtnStyle(data, index, id, btnName);
      }
    },

    displayAlgoBtnStyle(data, index, id, btnName) {
      let img = $("#" + id).find("img");
      $("#" + id).attr("flag", "hidden");
      $("#" + id).attr("title", "隐藏参数");
      img.attr("src", this.tdRightImg("reduce"));

      if (btnName !== "" && data === btnName) {
        this.showInputParameter = !this.showInputParameter;
        //基本参数：展开所有算法参数
        if (!this.globalDisplayBtn) {
          this.displayAllParams();
          this.globalDisplayBtn = true;
        }
        //  this.displayAlgoParam(index)//显示单独算法的所有
        this.setShowOrHidBtnStyle(1);
      } else {
        this.displayAlgoParam(index);
      }
    },
    hiddenAlgoBtnStyle(data, index, id, btnName) {
      let img = $("#" + id).find("img");
      $("#" + id).attr("flag", "display");
      $("#" + id).attr("title", "显示更多参数");
      img.attr("src", this.tdRightImg("plus"));

      if (btnName !== "" && data === btnName)
        this.showInputParameter = !this.showInputParameter;
      else {
        this.hiddenAlgoParam(index);
      }
    },

    //显示表格隐藏算法参数
    displayAlgoParam(index) {
      let currentTableParam = this.inputDisplayParamItems[index];
      let hiddenParam = this.hiddenDtParam[index];

      let length = currentTableParam.length;
      for (let j = 0; j < hiddenParam.length; j++) {
        let tempHid = hiddenParam[j];
        this.inputDisplayParamItems[index].push(tempHid);
        // this.$nextTick(function() {
        //   this.$set(this.inputDisplayParamItems[index], length + j, tempHid);
        //   let len = length + j + 1;
        //   this.inputDisplayParamItems[index].splice(len);
        // });
      }
    },
    // 隐藏表格显示算法参数
    hiddenAlgoParam(index) {
      /**
       * 思路：1、获取当前表格数据源currentTableParam：根据当前点击的表格索引获取当前表格参数
       * 2、移除表格数据源要隐藏的参数：currentTableParam和全局的隐藏参数hiddenParam进行比对 如果hiddenParam的参数和currentTableParam参数相同则移除currentTableParam对应的参数
       * 3、更新隐藏参数列表：在2的基础上判断当前全局的hiddenParam和已经显示到表格中的隐藏参数值是否发生变化 是 用currentTableParam最新的参数替换隐藏参数中对应参数
       */
      let currentTableParam = this.inputDisplayParamItems[index];
      let hiddenParam = this.hiddenDtParam[index];

      for (let i = 0; i < currentTableParam.length; i++) {
        let tempItem = currentTableParam[i];
        hiddenParam.forEach((element, index1) => {
          if (tempItem.name === element.name) {
            currentTableParam.splice(i, 1); //删除索引i的1个元素
            i--; //必须有
            // if (tempItem.default !== element.default) {
            //   // hiddenParam.findIndex(item => item === tempHid),//返回元素索引
            //   hiddenParam[j].splice(j, 1, tempItem); //在索引为indexx1的位置删除一个元素再添加一个元素对象 tempItem
            // }
          }
        });
      }
    },

    //点击全局参数显示更多后显示所有算法的所有参数 和之前的
    displayAllParams() {
      let _this = this;
      let display = this.inputDisplayParamItems;
      display.forEach((ele, index) => {
        _this.displayAlgoParam(index);
      });
    },

    getParamListNew() {
      let workflowId = this.workflowId;
      let path =
        this.GlobalUrlPath.processProduct.productLineQuery +
        workflowId +
        "/findParam";
      this.http.get(path).then((res) => {
        let data = res.data;
        console.log("算法原始参数", data);
        let isDeafault = false;
        if (data.code == 0) {
          let newTempList = [];
          for (var i in data.data) {
            let tempList = [];
            let newDataList = [];
            tempList = data.data[i]["input-parameters"];

            newDataList = this.getData(
              tempList,
              data.data[i].name,
              newDataList,
              isDeafault
            );
            newTempList.push(newDataList);
          }
          this.items = newTempList;
          console.log("表格渲染原始显示参数", newTempList);
        } else {
          this.items = [];
          this.$Message.error(res.data.message);
        }
      });
    },

    getData(tempList, groupName, newList, isDeafault) {
      let arrData = tempList;
      var tempInfo = [];
      var type = "";
      var enumInfo = "";
      for (var index in arrData) {
        tempInfo = arrData[index];
        type = tempInfo.type.name.toLowerCase();
        enumInfo = tempInfo.constraint;
        let enumObjArr = [];
        if (type === "select") {
          if (isDeafault) {
            enumObjArr = tempInfo.constraint;
          } else {
            enumInfo = tempInfo.constraint.values;
            for (var key in enumInfo) {
              let newObj = new Object();
              newObj.value = key;
              newObj.label = enumInfo[key];
              enumObjArr.push(newObj);
            }
          }
          // if (tempInfo.constraint[0].hasOwnProperty("value")) {
          //   enumObjArr = tempInfo.constraint;
          // } else if (tempInfo.constraint.hasOwnProperty("values")) {
          //   enumInfo = tempInfo.constraint.values;
          //   for (var key in enumInfo) {
          //     let newObj = new Object();
          //     newObj.value = key;
          //     newObj.label = enumInfo[key];
          //     enumObjArr.push(newObj);
          //   }
          // }

          delete tempInfo.constraint;
          tempInfo.constraint = enumObjArr;
        }
        if (!tempInfo.hasOwnProperty("default")) {
          tempInfo.default = "";
        }
        if (groupName != "") tempInfo.groupName = groupName;
        newList.push(tempInfo);
      }
      return newList;
    },

    regionChangeEvent(value, selectedData) {
      // this.region = selectedData.map((ele) => ele.label).join(",");
      if (selectedData.length < 1) return;
      let item = selectedData[selectedData.length - 1];
      this.regionTitle = value.join("/");
      if (item.tag === "china" || item.tag === "other") {
        this.region["name"] = item.label;
        this.region["geometry"] = item.geometry;
        this.region["code"] = item.code;
        // this.region["classify"] = item.classify;
      } else this.searchGeometryByCode(item);
    },
    changeParameterValueOfMixModel() {},
    changeInput(index) {
      this.listproductLine.map((v, i) => {
        if (i == index) {
          v.isCheck = true;
        } else {
          v.isCheck = false;
        }
      });
      let name = this.listproductLine[index].workflowName;
      let currentTime = this.getTime();
      this.taskName = name + "_" + this.userName + "_" + currentTime;
    },

    changeInputLevel(index) {
      this.options.map((v, i) => {
        if (i == index) {
          v.isCheck = true;
          this.priorityLevel = v.value;
        } else v.isCheck = false;
      });
    },

    changeInputProductionType(index) {
      if (index == 1) {
        //合成
        this.isRegion = true;
        this.timeRow = true;
        this.algoModelRow = false;

        this.searchprovince();

        this.currentTime = this.dateFormat("YYYY-mm", this.currentTime);
      } else {
        this.isRegion = false;
        this.timeRow = false;
        this.algoModelRow = true;
      }
      this.productionType.map((v, i) => {
        if (i == index) {
          v.isCheck = true;
          let value = {};
          let key = "ProducType-产品类型";
          value[key] = [];
          value[key].push(v.value);

          this.productionTypeValue = value;
          // ProducType-产品类型: ["单景产品"]
        } else v.isCheck = false;
      });

      this.filterProcessByConditons();
    },

    changeInputMixType(index) {
      this.mixType.map((v, i) => {
        if (i == index) {
          v.isCheck = true;
          this.mixTypeValue = v.value;
        } else {
          v.isCheck = false;
        }
      });

      // this.changeParameterValueOfMixModel();
    },
    changeInputAlgoType(index) {
      this.filterProcessByConditons();
    },
    changeSensorType(index) {
      this.filterProcessByConditons();
    },
    changeInputTimeOption(index) {
      this.timeList.map((v, i) => {
        if (i == index) {
          v.isCheck = true;
          // this.currentTime = v.value;
        } else v.isCheck = false;

        if (index == 0) {
          this.timeType = "month"; //monthrange
          this.timePlaceholder = "请选择月份";
          this.timeFormat = "yyyy-MM";
        }
        //  else if (index == 1) {
        //   this.timeType = "quarter"; //quarterrange
        //   this.timePlaceholder = "请选择季度";
        //   this.timeFormat = "yyyy-MM-dd";
        // }
        else if (index == 1) {
          this.timeType = "year";
          this.timePlaceholder = "请选择年份";
          this.timeFormat = "yyyy";
        }
      });
    },
    changeInputRegionOption() {
      this.regionType.map((v, i) => {
        if (i == index) {
          v.isCheck = true;
          this.currentRegionType = v.value;
        } else {
          v.isCheck = false;
        }
      });
    },

    getTime() {
      var date = new Date();
      var year = date.getFullYear();
      var month = date.getMonth() + 1;
      var day = date.getDate();
      var hours = date.getHours();
      var minutes = date.getMinutes();
      var seconds = date.getSeconds();
      if (month < 10) {
        month = "0" + month;
      }
      if (day < 10) {
        day = "0" + day;
      }
      let time = year + "" + month + "" + day + " " + hours + ":" + minutes;
      return time;
    },

    filterProcessByConditons() {
      let _this = this;
      // let productionType = this.productionTypeValue;
      let resultData = {};

      Object.keys(_this.productionTypeValue).forEach((key) => {
        resultData[key] = _this.productionTypeValue[key];
      });

      if (JSON.stringify(_this.productionTypeValue).indexOf("单景") != -1) {
        Object.keys(_this.sensorOptionValue).forEach((key) => {
          resultData[key] = _this.sensorOptionValue[key];
        });
        Object.keys(_this.algoTypeOptionValue).forEach((key) => {
          resultData[key] = _this.algoTypeOptionValue[key];
        });
      }

      resultData = JSON.stringify(resultData) === "{}" ? "" : resultData;
      if (resultData == "") {
        _this.$Message.info(
          "未查到对应条件的算法数据，默认显示该流程下所有算法流程哦!"
        );
      }
      debugger;
      this.filterLabels = resultData;
      this.getCommonProduct();
    },
    // 输入框判断 start
    onTimeChange(time, type) {
      let _this = this;
      type = _this.timeType;
      if (type === "quarter") {
        _this.currentTime = time[0] + "-" + time[1];
      } else {
        _this.currentTime = time;
      }
    },
    //////////////////////////////////以下为目录浏览功能//////////////////////////////////
    //文件浏览功能
    browserFile(item) {
      let self = this;
      self.currenItem = item;
      this.showZtreeModal = true;
      this.isRefModal = false;

      if (!item.hasOwnProperty("constraint")) {
        self.suffix = [];
        self.currenSelectSuffix = "";
        return;
      }

      let extensions = item.constraint.extensions.split(/[,;]/);
      let tempSuffix = [];
      for (var i in extensions) {
        let newObj = new Object();
        let name = extensions[i];
        newObj.value = name.substring(2, name.length);
        newObj.label = name.substring(2, name.length);
        tempSuffix.push(newObj);
      }
      self.suffix = tempSuffix;
      self.currenSelectSuffix = tempSuffix[0].value;
    },

    browserRef(item) {
      this.isRefModal = true;
      this.showZtreeRefModal = true;
      let self = this;
      self.currenItem = item;
      let path = this.GlobalUrlPath.processProduct.browserRefPath;
      let setting = {
        check: {
          enable: true,
          nocheckInherit: false,
          chkboxType: { Y: "", N: "" },
        },
        data: {
          simpleData: {
            enable: true,
          },
        },
        callback: {
          // beforeClick: this.beforeClick,
          // onClick: this.zTreeOnClick,
          // onCheck: this.zTreeOnCheck,
          // onExpand: this.zTreeOnClick
        },
      };
      this.http.get(path).then((res) => {
        let data = res.data;
        if (data.success == true) {
          this.ztreeInstanceOfReference = $.fn.zTree.init(
            $("#treeDemo1"),
            setting,
            data.data
          );
        }
      });
    },

    menuSetting(item, urlPath) {
      let _this = this;
      debugger;
      $(".displaySuffix").show();
      let checkType = { Y: "", N: "" }; //父与子的关联去掉
      if (item.type.name.toLowerCase() === "file") {
        checkType = { Y: "s", N: "ps" };
      }
      let setting = {
        check: {
          enable: true,
          nocheckInherit: false,
          chkboxType: checkType,
        },
        data: {
          simpleData: {
            enable: true,
          },
        },
        callback: {
          beforeClick: this.beforeClick,
          onClick: this.zTreeOnClick,
          onCheck: this.zTreeOnCheck,
          onExpand: this.zTreeOnClick,
        },
      };

      let name = this.$store.state.user.userName;
      let param = {
        userName: name,
      };

      this.http.get(urlPath, param).then((res) => {
        let data = res.data;
        if (data.success == true) {
          let children = _this.getFileDataByPid(data.data[0].id);
          data.data[0].children = children;
          this.ztreeInstanceOfFile = $.fn.zTree.init(
            $("#treeDemo"),
            setting,
            data.data
          );

          let nodes = this.ztreeInstanceOfFile.getNodes();
          this.ztreeInstanceOfFile.expandNode(nodes[0], true, false, false);
        }
      });
    },

    shareMenu(item) {
      let treeObj = this.ztreeInstanceOfFile;
      if (treeObj != null) {
        var nodes = treeObj.getNodes();
        for (var i = nodes.length - 1; i >= 0; i--) {
          treeObj.removeNode(nodes[i]);
        }
      }
      let path = this.GlobalUrlPath.processProduct.fileRootPath + 1; //1 共享 2 用户
      this.menuSetting(item, path);
      this.isShowMyFile = false;
    },

    userMenu(item) {
      let treeObj = this.ztreeInstanceOfFile;
      if (treeObj != null) {
        var nodes = treeObj.getNodes();
        for (var i = nodes.length - 1; i >= 0; i--) {
          treeObj.removeNode(nodes[i]);
        }
      }
      let path = this.GlobalUrlPath.processProduct.fileRootPath + 2; //1 共享 2 用户
      this.menuSetting(item, path);
      // this.isShowMyFile = true;//暂时需求不显示
    },

    zTreeOnClick(event, treeId, treeNode) {
      let path = this.GlobalUrlPath.processProduct.getFileListByPath;
      let param = {
        path: treeNode.id,
      };
      var treeObj = $.fn.zTree.getZTreeObj(treeId);
      var node = treeObj.getNodeByParam("id", treeNode.id);
      treeObj.selectNode(node);
      let sNode = treeObj.getSelectedNodes();
      if (sNode.length > 0) {
        let zAsync = sNode[0].zAsync;
        treeObj.reAsyncChildNodes(treeNode, "refresh");
        if (zAsync) {
        } else {
          this.http.get(path, param).then((res) => {
            let data = res.data;
            if (data.success == true) {
              treeNode.halfCheck = false;

              treeObj.addNodes(treeNode, data.data, false);
              // this.filterPathBySuffix(treeNode);

              // var hiddenNodes = new Array();
              // this.filterNodes(treeNode, hiddenNodes);
              // treeObj.hideNodes(hiddenNodes);

              sNode[0].zAsync = true;
            }
          });
        }
      }
    },

    getFileDataByPid(pid) {
      let _this = this;
      let result = "";
      let path = this.GlobalUrlPath.processProduct.getFileListByPath;
      let param = {
        path: pid,
      };
      $.ajax({
        type: "GET",
        async: false, // fasle同步，true异步
        headers: { Authorization: _this.$store.state.user.token },
        contentType: "application/json;charset=UTF-8",
        url: path,
        data: param,
        success: function (res) {
          if (res.success && res.code == 0) {
            result = res.data;
          }
        },
        error: function (e) {
          console.log(e.status);
        },
      });
      return result;
    },

    filterPathBySuffix(data) {
      let result = [];
      let suffix = this.currenSelectSuffix;
      result = data.filter(
        (item) =>
          item.isFile &&
          item.name.substring(
            item.name.length - suffix.length,
            item.name.length
          ) === suffix
      );
      data.forEach((ele) => {
        if (!ele.isFile) result.push(ele);
      });

      return result;
    },
    zTreeOnCheck(event, treeId, treeNode) {
      var treeObj = $.fn.zTree.getZTreeObj(treeId),
        nodes = treeObj.getCheckedNodes(true);
      let item = this.currenItem;

      if (item.type.name.toLowerCase() === "file") {
        //文件筛选过滤
        // if (!item.type.plural && nodes.length > 1) {
        //   //限制单个文件
        //   this.$Message.warning("该文件路径限制只能选一个文件哦！");
        //   treeNode.checked = false;
        //   treeObj.updateNode(treeNode);
        //   return;
        // }
        this.getFile(treeObj, treeNode);
        return;
      }
      if (item.type.name.toLowerCase() === "dir") {
        if (!treeNode.isParent) {
          this.$Message.warning("请选择文件夹！");
          treeNode.checked = false;
          treeObj.updateNode(treeNode);
          return;
        }
        if (!item.type.plural && nodes.length > 1) {
          //限制单个文件夹
          this.$Message.warning("当前算法限制只能选一个文件夹哦！");
          treeNode.checked = false;
          treeObj.updateNode(treeNode);
          return;
        }
      }
    },

    getFile(treeObj, treeNode) {
      let tempNode;
      let childsArr = [];

      if (treeNode.hasOwnProperty("children") && treeNode.checked) {
        tempNode = treeNode.children;
        this.getChildsByTreeNode(treeNode, childsArr);
        this.getFileBySuffix(treeObj, childsArr);
      } else if (treeNode.checked) {
        let suffix = this.currenSelectSuffix;
        let fileName = treeNode.name.toLowerCase();
        let regValue = fileName.substring(
          fileName.length - suffix.length,
          fileName.length
        );
        if (
          !suffix.hasOwnProperty("value") &&
          regValue.toLowerCase() !== suffix.toLowerCase()
        ) {
          treeNode.checked = false;
          this.$Message.warning("文件格式不符合过滤条件");
        }
        treeObj.updateNode(treeNode);
      }
    },

    getChildsByTreeNode(treeNode, childsArr) {
      if (treeNode.isParent) {
        //是父节点获取所有子节点
        let childs = treeNode.children;
        for (var i in childs) {
          childsArr.push(childs[i]);
          this.getChildsByTreeNode(childs[i], childsArr);
        }
      }
      return childsArr;
    },
    getFileBySuffix(treeObj, childsFiles) {
      let nodes = childsFiles;
      let fileName;
      let regValue;
      let tempNode;
      let suffix = this.currenSelectSuffix;
      if (nodes.length == undefined) {
        if (!nodes.isParent) {
          //文件
          fileName = nodes.name.toLowerCase();
          regValue = fileName.substring(
            fileName.length - suffix.length,
            fileName.length
          );
          if (regValue.toLowerCase() === suffix.toLowerCase())
            nodes.checked = true;
          else nodes.checked = false;
          treeObj.updateNode(nodes);
        }
      }
      for (var i = 0; i < nodes.length; i++) {
        tempNode = nodes[i];
        this.getFileBySuffix(treeObj, tempNode);
        if (tempNode.isParent) {
          let tempChilds = tempNode.children;
          let num = 0;
          for (var m in tempChilds) {
            if (tempChilds[m].checked) num++;
            if (num > 1) break;
          }
          if (num < 1) {
            tempNode.checked = false;
            treeObj.updateNode(tempNode);
          }
        }
      }
    },

    menuOk() {
      let isBatch = this.isBatch;
      var treeObj = this.ztreeInstanceOfFile,
        nodes = treeObj.getCheckedNodes(true);
      let tempNode = "";
      let info = "";
      for (var index in nodes) {
        tempNode = nodes[index];
        if (
          this.currenItem.type.name.toLowerCase() === "file" &&
          tempNode.isParent
        )
          continue;
        if (info == "") info = tempNode.id;
        else if (isBatch) {
          info += "#HT#" + tempNode.id;
        } else {
          info += "#TASK#" + tempNode.id;
        }
      }

      this.currenItem.default = info;
      this.reset();
    },
    menuRefOk() {
      let isRefModal = this.isRefModal;
      var treeObj = this.ztreeInstanceOfReference, //$.fn.zTree.getZTreeObj("treeDemo1"),
        nodes = treeObj.getCheckedNodes(true);
      let tempNode = "";
      let info = "";
      for (let i in nodes) {
        if (nodes.length > 1) {
          this.$Message.warning("请选择一个参考坐标系");
          break;
        }
        info = nodes[0].content.replace(/[\r\n]/g, "");

        this.currenItem.default = info; //nodes[0].name;
        this.reset();
      }
    },
    menuCancel() {
      this.reset();
    },

    //目录选择页面 重置
    reset() {
      let isRefModal = this.isRefModal;
      var treeObj;
      if (isRefModal) {
        this.showZtreeRefModal = false;
        treeObj = this.ztreeInstanceOfReference;
      } else {
        this.showZtreeModal = false;
        // $(".displaySuffix").css("display", "none");
        $(".displaySuffix").hide();
        treeObj = this.ztreeInstanceOfFile;
      }

      if (treeObj == null) return;
      var nodes = treeObj.getNodes();
      for (var i = nodes.length - 1; i >= 0; i--) {
        treeObj.removeNode(nodes[i]);
      }
    },

    // 过滤条件搜索
    suffixSearch() {
      var treeObj = this.ztreeInstanceOfFile,
        nodes = treeObj.getCheckedNodes(true);
      if (nodes.length < 1) {
        //暂时先不提示信息
        //this.$Message.warning("请先勾选文件或文件夹!");
        return;
      }
      debugger;
      for (var i in nodes) {
        this.getFile(treeObj, nodes[i]);
      }
    },

    // 文件另存为modal界面初始化
    menuSaveAs() {
      let self = this;
      let treeObj = this.ztreeInstanceOfFile;
      if (treeObj == null) {
        this.$Message.warning("请选择文件夹！");
        return;
      }

      let selectNodes = treeObj.getSelectedNodes();
      if (selectNodes.length < 1) {
        this.$Message.warning("请选择文件夹节点！");
        return;
      }
      if (!selectNodes[0].isParent) {
        this.$Message.warning("请选择文件夹！");
        return;
      }
      this.newFileName = ""; //界面文件名置为空
      this.saveAsModal = true;

      if (this.currenItem.type.name.toLowerCase() === "file") {
        self.isFile = true;
        $(".saveFile").css("display", "block");
        $(".saveFolder").css("display", "none");
      }
      //用于新增文件或文件夹标识
      else {
        $(".saveFile").css("display", "none");
        $(".saveFolder").css("display", "block");
        self.isFile = false;
      }
    },

    saveAsFileOK() {
      let fileName = this.newFileName;
      this.saveAsModal = false;
      let treeObj = this.ztreeInstanceOfFile;

      let selectNodes = treeObj.getSelectedNodes();
      let newNode = null;
      if (fileName == null || fileName == "") {
        this.$Message.warning("文件名或文件夹名称为空，请重写填写");
        return;
      }
      if (this.isFile) {
        //文件 判断文件名是否符合带后缀
        let a = fileName.split("").reverse().join("");
        let b = a.substring(0, a.search(/\./)).split("").reverse().join("");
        if (b == null || b == "") {
          this.$Message.warning("该文件名无效，没有后缀");
          return;
        }
        newNode = {
          name: fileName,
          id: selectNodes[0].id + "/" + fileName,
          isParent: false,
        };
      } else {
        newNode = {
          name: fileName,
          id: selectNodes[0].id + "/" + fileName,
          isParent: true,
        };
      }
      if (newNode == null) return;
      treeObj.addNodes(selectNodes[0], 0, newNode, true); //新增节点放在文件夹的顶层并默认选择
      let node = selectNodes[0].children[0];
      node.checked = true;
      treeObj.updateNode(node);
    },

    saveAsFileCancel() {
      this.saveAsModal = false;
    },
    //////////////////////////////////以上文件浏览功能//////////////////////////////////
    filteCancel() {
      this.processfilterModal = false;
    },
    filterOk() {
      this.processfilterModal = false;
      let sensorType = this.sensorOptionValue;
      let algoType = this.algoTypeOptionValue;
      let productionType = this.productionTypeValue;
      // let region = this.region;
      this.getProduct();
    },
    searchprovince() {
      let self = this;
      let path = this.GlobalUrlPath.dataEngine.queryFeatureBase64;
      let param = {
        collectionName: "area_info",
        orderColName: "code",
        pageCount: 0,
        pageNum: 0,
        queryConditionList: [
          {
            compareOp: "=",
            fieldName: "type",
            fieldValue: 0,
          },
        ],
        queryResultList: ["name", "code"],
        // queryResultList: [],
      };
      let strJson = JSON.stringify(param);
      let sendData =  this.$Base64.encode(strJson);
      self.http.postText(path, sendData).then((res) => {
        if (res.data.code == 0) {
          let province = res.data.data;
          for (let i = 0; i < province.length; i++) {
            let tempdata = {
              code: province[i].properties.code,
              label: province[i].properties.name,
              value: province[i].properties.name, //可以不写 但是字体会变颜色
              children: [],
              loading: false,
              tag: "province",
            };
            self.regionCascader.push(tempdata);
          }
        }
      });
    },
    searchCity(item, callback, tag) {
      let _this = this;
      let path = this.GlobalUrlPath.dataEngine.queryFeatureBase64;
      let param = {
        collectionName: "area_info",
        orderColName: "code",
        pageCount: 0,
        pageNum: 0,
        queryConditionList: [
          {
            compareOp: "=",
            fieldName: "type",
            fieldValue: tag === "city" ? 1 : 2,
          },
          {
            compareOp: "=",
            fieldName: "parent_code",
            fieldValue: item.code,
            // relationNextOne: "and",
          },
        ],
        queryResultList: ["name", "code"],
        // queryResultList: [],
      };
      let strJson = JSON.stringify(param);
      let sendData =  this.$Base64.encode(strJson);

      _this.http.postText(path, sendData).then((res) => {
        let data = res.data.data;
        for (let j = 0; j < data.length; j++) {
          let tempdata = {
            value: data[j].properties.name,
            code: data[j].properties.code,
            label: data[j].properties.name,
            children: [],
            loading: false,
            tag: tag,
          };
          if (tag === "region") {
            delete tempdata.children;
            delete tempdata.loading;
          }
          item.children.push(tempdata);
        }
        item.loading = false;
        callback();
      });
    },

    searchGeometryByCode(item) {
      let _this = this;
      let path = this.GlobalUrlPath.dataEngine.queryFeatureBase64;
      let type = 0;
      if (item.tag === "city") type = 1;
      else if (item.tag === "region") type = 2;

      let param = {
        collectionName: "area_info",
        orderColName: "",
        pageCount: 0,
        pageNum: 0,
        queryConditionList: [
          {
            compareOp: "=",
            fieldName: "type",
            fieldValue: type,
          },
          {
            compareOp: "=",
            fieldName: "code",
            fieldValue: item.code,
          },
        ],
        queryResultList: [],
      };
      let strJson = JSON.stringify(param);
      let sendData =  this.$Base64.encode(strJson);

      _this.http.postText(path, sendData).then((res) => {
        let data = res.data;
        if (data.code == 0) {
          _this.region["name"] = item.label;
          _this.region["geometry"] = data.data[0].geometry;
          _this.region["code"] = item.code;
          // _this.region["classify"] = item.classify;
        } else {
          _this.$Message.error(res.data.message);
        }
      });
    },

    loadRegionData(item, callback) {
      let _this = this;
      item.loading = true;
      setTimeout(() => {
        if (item.tag === "other") {
          item.children = [
            {
              value: "重点区域",
              label: "某重点区域",
              tag: "other",
              code: 1,
              classify: "other",
            },
          ];
        } else if (item.tag === "china") {
          item.children = [
            {
              value: "全国",
              label: "全国",
              tag: "china",
              code: 0,
              classify: "china",
            },
          ];
        } else if (item.tag === "province") {
          _this.searchCity(item, callback, "city");
        } else if (item.tag === "city") {
          _this.searchCity(item, callback, "region");
        }
        item.loading = false;
        callback();
      }, 500);
    },

    MyFileClicked() {
      let name = this.$store.state.user.userName;
      let userId = this.$store.state.user.userId;
      this.url = fileUrl + "/?name=" + name + "&userId=" + userId;
      this.myFileModal = true;
    },
    myFileOk() {
      this.userMenu(this.currenItem);
      this.myFileModal = false;
    },
    myFileCancel() {
      this.myFileModal = false;
    },
  },
  components: {
    DatePickers,
  },
};
</script>
<!--css样式-->
<style lang='scss' scoped>
.picDiv {
  width: 310px;
  background: rgba(255, 255, 255, 1);
  border-radius: 4px;
  border: 1px solid rgba(217, 217, 217, 1);
  margin: 0.1rem 1rem 0 5.6rem;
  height: 494px;
  display: flex;
  justify-content: center;
  align-items: center;
  .img1 {
    max-width: 100%;
    max-height: 460px;
  }
}

.optiostyle {
  position: absolute;
  right: 0;
  z-index: 99;

  display: flex;
  height: 40px;
  width: 280px;
  align-items: center;
  margin-top: -50px;

  font-size: 1rem;
  font-weight: bold;
}
.myFileDiv {
  margin-top: -22px;
  margin-left: 96px;
}
.myFileBtn {
  width: 70px;
  height: 21px;
  font-size: 13px;
  margin: 0px;
  padding: 0px;
}
.saveFileStyle {
  width: 280px;
}
.treeDiv {
  height: 500px;
  width: 760px;
  overflow-y: auto;
}
.treeDiv1 {
  height: 300px;
  width: 300px;
  overflow-y: auto;
}
.suffixBtn {
  margin-left: 10px;
}
.selectSuffix {
  padding-left: 10px;
  margin-bottom: 0rem;
}
.inputTd {
  float: left;
  width: 88%;
  margin-bottom: 7px;
}
.inputTdTextArea {
  float: left;
  width: 88%;
  margin-bottom: 7px;
}

.btnBrowser {
  float: right;
  margin-top: 4px;
  margin-bottom: 0px;
}
.paramBtn {
  border: 0;
  color: #95a5bc;
}
.batchSelect {
  width: 550px;
  height: 200px;
  overflow: auto;
}
.inputRadioDiv {
  display: flex;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  width: 556px;
  margin-left: 34px;
  background: rgba(216, 216, 216, 0.09);
  border-radius: 3px;
  border: 1px solid rgba(151, 151, 151, 0.09);
}

.inputRadioDiv1 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  width: 150px;
  height: calc(1.5rem + 0.75rem + 2px);
  margin-left: 40.6%; // 103px;
  background: rgba(216, 216, 216, 0.09);
  border-radius: 3px;
  border: 1px solid rgba(151, 151, 151, 0.09);
  padding-top: 6px;
  float: auto;
}
.filterRadioRow {
  margin-top: -11px;
  margin-bottom: 3px;
}

.inputRadioDiv2 {
  display: flex;
  width: 276px;
  height: calc(1.5rem + 0.75rem + 2px);
  margin-left: 38px;
  float: auto;
}
.inputRadioDiv3 {
  display: flex;
  align-items: center;
  height: calc(1.5rem + 0.75rem + 2px);
  margin-left: 16px;
}
.inputRadioDiv4 {
  display: flex;
  height: calc(1.5rem + 0.75rem + 2px);
  margin-left: 38px;
  float: auto;
}
.processFileterDiv {
  width: 390px;
  text-align: left;
}
.levelDiv {
  width: 42px;
  float: left;
  padding-top: 6px;
  margin-left: 38px;
}
.levelDiv1 {
  width: 60px;
  float: left;
  padding-top: 6px;
  margin-left: 38px;
}
.inputRadio {
  width: 48%;
  margin-left: 10px;
}
.btn1 {
  margin: 0.3rem;
}
.footDiv {
  z-index: 99;
  width: 100%;
  margin-top: -38px;
}

 
.jia {
  width: 12px;
  height: 12px;
  margin: -15px 0 3px -6px;
}
.imgBtn {
  position: absolute;
  right: 11px;

  width: 16px;
  height: 16px;
  margin-top: 2px;
}
.tbHeader {
  width: 100%;
  display: inline-block;
}
.delBtn {
  color: #4f5d73;
  background-color: #ebedef;
  border-color: #ebedef;
}
.delBtn:hover {
  color: #4f5d73;
  background-color: #d6dade;
  border-color: #cfd4d8;
}

.styImg {
  vertical-align: middle;
  max-width: 700px;
  overflow: auto;
}

.processFilter {
  cursor: pointer;
}
.processFilter:hover {
  color: #2d8cf0;
}

.datePick {
  width: 212px;
  float: right;
  margin-left: 34px;
  margin-top: 2px;
}
.regionCas {
  width: 212px;
  float: right;
  margin-left: 88px; //34px;
  margin-top: 2px;
}
.filterLabel {
  margin-top: 9px;
}
.iframe {
  width: 100%;
  height: 67vh;
  border: 1px saddlebrown;
}

/**leftCard 整体布局 start */
.cardBody {
  margin: 0 10px 10px 20px;
  display: flex;
  flex-direction: column;
  height: 100%;
}
header {
  flex: 0 0 auto;
}
main {
  overflow: hidden;
  overflow-y: auto;
  flex-grow: 1;

  margin-bottom: 16px;
}

/**leftCard 整体布局 end */
</style>

